.left-panel{
    width: 220px;
    height: calc(100vh - 50px);     /* 控制左侧二级导航栏高度，正好填充满屏幕-导航栏高度 */
}

/*头像部分*/
.avatar{
    margin-top: 30px;
}
.avatar-img{
    width: 96px;    /* 头像长度 */
}

/*导航列表部分*/
.sub-navbar{
    margin-top: 40px;
    width: 220px;   /* 二级列表外围容器长度 */
}
.sub-navbar-link {
    /*将link设置成block后,块状区域会自动填充满剩余div空间,与预先需求相符,故而不用再写width*/
    /*width: calc(10% - 3px*2 - 10px*2);     !* 减去padding和margin *!*/
    padding: 3px;
    border-radius: 4px;
    margin: 5px 10px;
}
.sub-navbar-icon {
    width: 25px;    /* 设置二级菜单Logo宽度 */
    margin-inline: 5px; /* 二级菜单Logo与边框、文字的间据 */
}
.sub-navbar-title {
    margin-left: 10px;  /*文字与二级菜单Logo的间距*/
}

/* 底部按钮 */
.left-panel-bottom{
    width: 160px;
    height: 36px;
    margin-top: auto;   /* 区域沉底 */
    margin-bottom: 20px;
}

.left-panel-bottom-link{
    width: calc(50% - 4px*2);   /* 减去padding */
    height: calc(100% - 4px*2); /* 减去padding */
    padding: 4px;
    border-radius: 4px;
}
